header.header.header-sticky.p-0.mb-4
  .container-fluid.border-bottom.px-4
    button.header-toggler(type="button" onclick="coreui.Sidebar.getInstance(document.querySelector('#sidebar')).toggle()" style="margin-inline-start: -14px;")
      svg.icon.icon-lg
        use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-menu")
    ul.header-nav.d-none.d-lg-flex
      li.nav-item
        a.nav-link(href="#") Dashboard
      li.nav-item
        a.nav-link(href="#") Users
      li.nav-item
        a.nav-link(href="#") Settings
    ul.header-nav.ms-auto
      li.nav-item
        a.nav-link(href="#")
          svg.icon.icon-lg
            use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-bell")
      li.nav-item
        a.nav-link(href="#")
          svg.icon.icon-lg
            use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-list-rich")
      li.nav-item
        a.nav-link(href="#")
          svg.icon.icon-lg
            use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-envelope-open")
    ul.header-nav
      li.nav-item.py-1
        .vr.h-100.mx-2.text-body.text-opacity-75
      li.nav-item.dropdown
        button.btn.btn-link.nav-link.py-2.px-2.d-flex.align-items-center(type="button" aria-expanded="false" data-coreui-toggle="dropdown")
          svg.icon.icon-lg.theme-icon-active
            use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-contrast")
        ul.dropdown-menu.dropdown-menu-end(style='--cui-dropdown-min-width: 8rem;')
          li
            button.dropdown-item.d-flex.align-items-center(type='button' data-coreui-theme-value='light')
              svg.icon.icon-lg.me-3
                use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-sun")
              | Light
          li
            button.dropdown-item.d-flex.align-items-center(type='button' data-coreui-theme-value='dark')
              svg.icon.icon-lg.me-3
                use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-moon")
              | Dark
          li
            button.dropdown-item.d-flex.align-items-center.active(type='button' data-coreui-theme-value='auto')
              svg.icon.icon-lg.me-3
                use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-contrast")
              | Auto
      li.nav-item.py-1
        .vr.h-100.mx-2.text-body.text-opacity-75
      li.nav-item.dropdown
        a.nav-link.py-0.pe-0(data-coreui-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false")
          .avatar.avatar-md
            img.avatar-img(src="assets/img/avatars/8.jpg" alt="user@email.com")
        .dropdown-menu.dropdown-menu-end.pt-0
          .dropdown-header.bg-body-tertiary.text-body-secondary.fw-semibold.rounded-top.mb-2 Account
          a.dropdown-item(href="#")
            svg.icon.me-2
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-bell")
              |
            |  Updates
            span.badge.badge-sm.bg-info.ms-2 42
          a.dropdown-item(href="#")
            svg.icon.me-2
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-envelope-open")
              |
            |  Messages
            span.badge.badge-sm.bg-success.ms-2 42
          a.dropdown-item(href="#")
            svg.icon.me-2
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-task")
              |
            |  Tasks
            span.badge.badge-sm.bg-danger.ms-2 42
          a.dropdown-item(href="#")
            svg.icon.me-2
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-comment-square")
              |
            |  Comments
            span.badge.badge-sm.bg-warning.ms-2 42
          .dropdown-header.bg-body-tertiary.text-body-secondary.fw-semibold.my-2
            .fw-semibold Settings
          a.dropdown-item(href="#")
            svg.icon.me-2
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-user")
              |
            |  Profile
          a.dropdown-item(href="#")
            svg.icon.me-2
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-settings")
              |
            |  Settings
          a.dropdown-item(href="#")
            svg.icon.me-2
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-credit-card")
              |
            |  Payments
            span.badge.badge-sm.bg-secondary.ms-2 42
          a.dropdown-item(href="#")
            svg.icon.me-2
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-file")
              |
            |  Projects
            span.badge.badge-sm.bg-primary.ms-2 42
          .dropdown-divider
          a.dropdown-item(href="#")
            svg.icon.me-2
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-lock-locked")
              |
            |  Lock Account
          a.dropdown-item(href="#")
            svg.icon.me-2
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-account-logout")
              |
            |  Logout
  .container-fluid.px-4
    block breadcrumb

